/* Make divs adjust to image size */
.featured_background {
    width: 100%;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    transition: transform 0.3s, box-shadow 0.3s;
}

.featured_background:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(128, 0, 32, 0.2);
}

.featured_background img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

/* Optional: Add captions if you want */
.featured_background {
    position: relative;
}

.featured_background::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%;
    background: linear-gradient(to top, rgba(128,0,32,0.7), transparent);
    pointer-events: none;
    border-radius: 0 0 15px 15px;
}